﻿<%@ Page Title="" Language="C#" MasterPageFile="~/Admin/Admin.Master" AutoEventWireup="true" CodeBehind="QL_Album.aspx.cs" Inherits="ChineseSchool.Admin.QL_Album" %>

<asp:Content ID="Content1" ContentPlaceHolderID="head" runat="server">
    <style type="text/css">
        .form-horizontal .control-label {
            text-align: left;
        }

        img {
            border: none;
        }

        .users-list {
        }

        .album-list > li {
            list-style: none;
            width: 19%;
            float: left;
            padding: 10px;
            text-align: center;
            margin: 5px;
            background-color: #f2f2f2;
            opacity: 0.7;
        }

            .album-list > li img {
                width: 128px;
                height: 128px;
            }

            .album-list > li > a:hover,
            .album-list > li > a:hover .album-list-name {
                color: #999;
            }

        .album-list-name,
        .album-list-date,
        .album-list-command {
            display: block;
        }

        .album-list-name {
            font-weight: 600;
            color: #444;
            overflow: hidden;
            white-space: nowrap;
            text-overflow: ellipsis;
        }

        .album-list-date {
            font-size: 12px;
        }

        .album-list-command a {
            padding: 0 10px;
        }

        .album-list-update {
            text-align: right;
        }

        .album-list-delete {
            text-align: left;
        }
    </style>
    <script type="text/javascript">
        $(document).ready(function () {
            $('#<%= imgAvatar.ClientID%>').css("vertical-align", "bottom");

            $('#btnChangeImage').click(function () {
                $('.modal').modal('show');
            });
        });
    </script>
</asp:Content>
<asp:Content ID="Content2" ContentPlaceHolderID="ContentPlaceHolder_Top" runat="server">
    <div class="example-modal">
        <div class="modal">
            <div class="modal-dialog">
                <div class="modal-content">
                    <div class="modal-header">
                        <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
                        <h4 class="modal-title">Chọn thay đổi ảnh đại diện</h4>
                    </div>
                    <div class="modal-body">
                        <asp:FileUpload ID="uploadAvatar" runat="server" />
                    </div>
                    <div class="modal-footer">
                        <button type="button" class="btn btn-default pull-left" data-dismiss="modal">Đóng</button>
                        <asp:Button ID="btnSelectImage" CssClass="btn btn-primary" Text="Chọn ảnh này!" OnClick="BtnSelectImageClick" runat="server" />
                    </div>
                </div>
            </div>
        </div>
    </div>
    <asp:Panel ID="pnlAdd" Visible="false" runat="server">
        <div class="row">
            <div class="col-md-12">
                <div class="box box-info">
                    <div class="box-header with-border">
                        <asp:Label ID="lblTitle" runat="server"></asp:Label>
                    </div>
                    <div class="form-horizontal">
                        <div class="box-body">
                            <div class="form-group">
                                <asp:Label ID="lblAlbumName" Text="Tên album:" CssClass="col-sm-2 control-label" runat="server" />
                                <div class="col-sm-10">
                                    <asp:TextBox runat="server" ID="txtAlbumName" CssClass="form-control"></asp:TextBox>
                                </div>
                            </div>
                            <div class="form-group">
                                <asp:Label ID="lblAvatar" Text="Ảnh đại diện:" CssClass="col-sm-2 control-label" runat="server" />
                                <div class="col-sm-10">
                                    <asp:Image ID="imgAvatar" Width="128" Height="128" runat="server" />
                                    <a href="#" id="btnChangeImage">Đổi ảnh</a>
                                </div>
                            </div>
                            <div class="form-group">
                                <asp:Label ID="lblMenu" Text="Thuộc danh mục:" CssClass="col-sm-2 control-label" runat="server" />
                                <div class="col-sm-10">
                                    <asp:DropDownList ID="ddlMenu" runat="server" CssClass="form-control">
                                    </asp:DropDownList>
                                </div>
                            </div>
                            <div class="form-group">
                                <asp:Label ID="lblIsLock" Text="Hiển thị:" CssClass="col-sm-2 control-label" runat="server" />
                                <div class="col-sm-10">
                                    <div class="radio col-sm-1">
                                        <asp:RadioButton ID="rdbLockYes" runat="server" Text="Có" GroupName="rbLock" />
                                    </div>
                                    <div class="radio col-sm-1">
                                        <asp:RadioButton ID="rdbLockNo" runat="server" Text="Không" GroupName="rbLock" />
                                    </div>
                                </div>
                            </div>
                            <div class="form-group">
                                <asp:Label ID="lblSystem" Text="Thuộc về admin:" CssClass="col-sm-2 control-label" runat="server" />
                                <div class="col-sm-10">
                                    <div class="radio col-sm-1">
                                        <asp:RadioButton ID="rdbSystemYes" runat="server" Text="Có" GroupName="rdbSystem" />
                                    </div>
                                    <div class="radio col-sm-1">
                                        <asp:RadioButton ID="rdbSystemNo" runat="server" Text="Không" GroupName="rdbSystem" />
                                    </div>
                                </div>
                            </div>
                        </div>
                        <div class="box-footer">
                            <asp:Button ID="btnAdd" runat="server" Text="Thêm mới" CssClass="btnSubmit" OnClick="BtnAddClick" />
                            <asp:Button ID="btnEdit" runat="server" Text="Cập nhật" CssClass="btnSubmit" OnClick="BtnUpdateClick" />
                            <asp:Button ID="btnCancel" runat="server" Text="Hủy" OnClick="BtnCancelClick" />
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </asp:Panel>
    <asp:Panel ID="pnlDisplay" Visible="true" runat="server">
        <div class="row">
            <div class="col-md-12">
                <div class="box box-danger">
                    <div class="box-header with-border">
                        <h3 class="box-title">Danh sách album</h3>
                    </div>
                    <div class="box-body no-padding">
                        <ul class="album-list clearfix">
                            <asp:Repeater ID="rptAlbums" OnItemDataBound="RptAlbumsItemDataBound" OnItemCommand="RptAlbumsItemCommand" runat="server">
                                <ItemTemplate>
                                    <li>
                                        <asp:Image ID="imgAvatar" ImageUrl='<%# DataBinder.Eval(Container.DataItem, "ImageUrl") %>' runat="server" />
                                        <asp:HyperLink ID="lnkAlbumDetail" NavigateUrl="/Admin/QL_User.aspx?key=HV" Text='<%# DataBinder.Eval(Container.DataItem, "AlbumName") %>' CssClass="album-list-name" runat="server" />
                                        <div class="album-list-command">
                                            <asp:LinkButton ID="lnkUpdate" Text="Chỉnh sửa" CommandName="update" CommandArgument='<%# DataBinder.Eval(Container.DataItem, "AlbumID")  %>' runat="server" />
                                            <asp:LinkButton ID="lnkDelete" Text="Xóa" CommandName="delete" CommandArgument='<%# DataBinder.Eval(Container.DataItem, "AlbumID")  %>' OnClientClick=" return confirm('Bạn có chắc chắn muốn xoá?') " runat="server" />
                                        </div>
                                    </li>
                                </ItemTemplate>
                            </asp:Repeater>
                        </ul>
                    </div>
                    <div class="box-footer clearfix">
                        <div class="col-xs-6 text-right">
                            <asp:Button ID="btnNew" runat="server" Text="Thêm mới" OnClick="BtnNewClick" />
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </asp:Panel>
</asp:Content>
